<template>
	<view>
		<view class="text-center pt-5 mb-5 font-weight-bold fs-32">提货码</view>
		<view class="flex mx-auto rounded-lg invite_code">
			<canvas id="qrcode" canvas-id="qrcode" class="mx-auto" style="width: 200px;height: 200px;" />
		</view>
	</view>
</template>

<script>
	// 生成二维码
	import uQRCode from '@/components/uqrcode/uqrcode.js'
	import {
		getOrderDetail
	} from "@/api/order.js";
	export default {
		data() {
			return {
				sn: ''
			}
		},
		onLoad(options) {
			this.loadData(options.sn);
			this.sn = options.sn;
		},
		methods: {
			async loadData(sn) {
				uni.showLoading({
					title: "加载中",
				});
				getOrderDetail({
					id: sn
				}).then((res) => {
					this.order = res.data.data;
					if (this.$store.state.isShowToast) {
						uni.hideLoading()
					};
					this.showQrcode()
				});

			},
			/** 生成二维码 */
			showQrcode(data) {
				let _this = this;
				this.$nextTick(function() {
					uQRCode.make({
							canvasId: 'qrcode',
							componentInstance: this,
							size: 200,
							margin: 10,
							text: _this.order.id,
							backgroundColor: '#ffffff',
							foregroundColor: '#000000',
							fileType: 'png',
							errorCorrectLevel: uQRCode.errorCorrectLevel.H
						})
						.then(res => {
							console.log(res)
						})
				})
			},
		}
	}
</script>

<style>

</style>